<template>
  <div class="newsdetail">
    <!-- <ul>
      <li>编号：{{ params.id }}</li>
      <li>标题：{{ params.title }}</li>
      <li>内容：{{ params.content }}</li>
    </ul> -->
    <ul>
      <li>编号：{{ id }}</li>
      <li>标题：{{ title }}</li>
      <li>内容：{{ content }}</li>
    </ul>
  </div>
</template>

<script setup lang="ts">
// import { toRefs } from "vue";
// import { useRoute } from "vue-router";
// const route = useRoute(); //useRoute() 获取当前路由对象
// // let { query } = toRefs(route); //解构query不具备响应式，需要加上toRefs()
// // console.log("route@", route, query);
// //-------------------
// //params参数
// let { params } = toRefs(route);
// console.log("route@", route, params);

//路由配置规则加上props:true,就相当与<Detail id='xx' title='xx' content='xx'/>
defineProps(["id", "title", "content"]);
</script>
<style scoped>
.newsdetail {
}
</style>
